
import React, { Component, lazy, Suspense } from 'react';
import { BrowserRouter as Router, Route, Switch, Redirect } from "react-router-dom";
import MyRote from './MyRote';
import Home from '../view/home'
import Login from '../view/login'
import Index from '../view/index'

const NotFound = lazy(() => import('../view/notFound/index'))
const Car = lazy(() => import('../view/car/index'))
const Icon = lazy(() => import('../view/icon/index'))
const Task = lazy(() => import('../view/taskManage/index'))
const Leave = lazy(() => import('../view/leave/index'))




class MyRouter extends Component {
	render() {

		return (
			<div>
				{/* <div>
					公共内容
				</div> */}
				<Router>

					<Suspense fallback={<div>Loading...</div>}>
						<Switch>
							<Route path="/login" exact component={Login}></Route>
							<MyRote path="/404" exact component={NotFound}></MyRote>

							<Route path="/" render={() =>
								<Home>
									<MyRote path="/" exact component={Index}></MyRote>
									<MyRote path="/car" exact component={Car}></MyRote>
									<MyRote path="/icon" exact component={Icon}></MyRote>
									<MyRote path="/leave" exact component={Leave}></MyRote>
									<MyRote path="/task" exact component={Task}></MyRote>
								</Home>}>
							</Route>

							<Redirect to='/404' exact></Redirect>
						</Switch>
					</Suspense>
				</Router>
			</div>

		);
	}
}

export default MyRouter;


